<script>
export default {
  name: "success",
  onReady() {
    let show_page = uni.getStorageSync('wallet_status')
    if (show_page === 'true') {
      uni.switchTab({
        url: '/pages/index/index'
      })
    } else {
      let ai = uni.getStorageSync('invite_way')
      if (ai === 'ai') {
        this.$refs.popup3.open()
      } else {
        this.$refs.popup4.open()
      }
    }
  },
  methods: {
    iKnow() {
      uni.navigateTo({
        url: '/pages/aipicture/aipicture'
      })
    },
    iKnow2() {
      uni.switchTab({
        url: '/pages/index/index'
      })
    }
  }
}
</script>

<template>
<view>
  <!--AI  -->
  <uni-popup ref="popup3" type="center" :mask-click="false">
    <view class="container">
      <view class="success_img">
        <image src="@/static/finish/purple_success.png"></image>
      </view>
      <view class="invite_subtitle" style="margin-top: 50rpx">助力成功，恭喜您获得20个灵感星，灵感星可在AI大赛中使用</view>
      <view class="invite_button_container" style="margin-top: 50rpx;">
        <view class="go_next" @click="iKnow">开心收下</view>
      </view>
    </view>
  </uni-popup>
  <!--normal-->
  <uni-popup ref="popup4" type="center" :mask-click="false">
    <view class="container container_more">
      <view class="success_img">
        <image src="@/static/finish/success.png"></image>
      </view>
      <view class="invite_subtitle" style="margin-top: 50rpx">初始价值为100元的卢克已到手，可前往「我的馆藏」中查看</view>
      <view class="invite_button_container" style="margin-top: 50rpx;">
        <view class="go_next go_next_more" @click="iKnow2">我知道了</view>
      </view>
    </view>
  </uni-popup>

</view>
</template>

<style scoped lang="scss">
.invite_button_container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 50rpx;

  .close {
    border-radius: 50%;
    width: 292rpx;
    height: 100rpx;
    line-height: 100rpx;
    font-family: PingFang SC;
    font-size: 36rpx;
    color: #000000;
    text-align: center;
    opacity: 0.9;
    background: #ffffff;
    border-radius: 60rpx;
    box-shadow: 5rpx 5rpx 5rpx 5rpx rgba(234, 234, 234, 1);
    margin-right: 50rpx;
  }

  .go_next {
    border-radius: 60rpx;
    background: linear-gradient(rgba(108, 88, 213, 1), rgba(170, 86, 215, 1));
    line-height: 100rpx;
    text-align: center;
    width: 292rpx;
    height: 100rpx;
    font-family: PingFang SC;
    font-size: 36rpx;
    color: #FFFFFF;
    opacity: 0.9;
  }
  .go_next_more {
    background: linear-gradient(rgba(155, 198, 81, 1), rgba(72, 190, 132, 1));
  }
}

.container {
  padding: 70rpx 50rpx;
  background: url("@/static/finish/purple_bg.png") no-repeat;
  background-size: contain;
  width: 700rpx;
  height: 650rpx;

  .success_img {
    margin: 0 auto;
    width: 240rpx;
    height: 244rpx;

    image {
      width: 240rpx;
      height: 244rpx;
    }
  }

  .invite_title {
    font-family: PingFang SC;
    font-weight: bold;
    font-size: 39rpx;
    color: #000000;
    opacity: 0.9;
    margin-bottom: 27rpx;
  }

  .invite_subtitle {
    font-family: PingFang SC;
    font-size: 28rpx;
    color: #000000;
    opacity: 0.8;
    margin-bottom: 30rpx;
  }
}
.container_more {
  background: url("@/static/finish/green_bg.png") no-repeat;
  background-size: contain;
}
</style>
